<template>
	<HeaderNav />
	<article>
		<div id="main">
			<section class="aside">
				<!-- 定义右侧窗口信息 -->
				<UserAside />
				
				<Advice />
			</section>
			<section>
				<h1 class="attent-title">人员关注信息</h1>
				
				<div class="bg-hr"></div>

				<div class="attent-list">
					<!-- 一个关注  -->
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="lr">已关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
					
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="qx">关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
					
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="lr">已关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
					
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="lr">已关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
					
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="lr">已关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
					
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="lr">已关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
					
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="lr">已关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
					
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="lr">已关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
					
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="lr">已关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
					
					<div class="attent">
						<img src="../assets/images/user.jpg" />
						<a class="lr">已关注</a>
						<a class="rf" href="/more/3">查看他的资源</a>
						<span class="user-a">love爱有缘</span>
					</div>
				</div>
				
				<!-- 分页插件 -->
				<VanPagination v-model="page" :totalItems="total" :itemsPerPage="10" :showPageSize="5" 
					:forceEllipses="true" />
				
			</section>
			
		</div>
	</article>
	<Footer />
</template>

<script>
import HeaderNav from "../components/HeaderNav.vue";
import Footer from "../components/Footer.vue"; 
import VanPagination from '../components/VanPagination.vue' ;
import UserAside from "../components/UserAside.vue";
import Advice from "../components/Advice.vue";
	
export default {
	components: {
		HeaderNav, 
		Footer ,
		VanPagination ,
		UserAside ,
		Advice,
	},
	data() {
		return {
			page: 1, 
			total: 100,
		}
	}
}
</script>

<style>
</style>